<template>
	<view id="relocation" class="digital-page">
		<back-btn></back-btn>
		<view class="banner">
			<view class="title-area">
				<div class="title-cn">迁台渊源</div>
				<div class="title-en">Relocation to Taiwan</div>
			</view>
		</view>
		<view class="main-content">
			<template v-for="(v, k) in data" :key="k" >
				<view class="header">
					{{ v.Topic }}
				</view>
				<rich-text :nodes="v.nodes" class="content"  @click="richTextClick(v.imgs)">
				</rich-text>
			</template>
		</view>
	</view>
</template>

<script setup>
	// 黄昕焕 @ 2023年4月19日 页面
	// 黄昕焕 @ 2023年5月5日 绑定(缺少数据)
	// 姚珅 @ 5月21日 返回组件添加，页面修改以及部分绑定 (缺少预约馆的数据)
	// 黄玺 @ 9月9日 重新修改逻辑
	import { onLoad } from '@dcloudio/uni-app'
	import backBtn from './back.vue'
	import { ref } from 'vue'
	import parseHtmlData from './parseHtmlData.js'

	let uniqueCode = "1eqL2S0KLyhuVF0J7fxP86";
	let data = ref([]);
	
	uni.post("/api/categorySource", {
		uniqueCode,
		hasContent: true,
		pageSize: 1
	}).then(msg => {
		for (let d of msg.data) {
			let { nodes, imgs } = parseHtmlData(d.Content);
			d.nodes = nodes;
			d.imgs = imgs;
			data.value.push(d);
		}
	});
	
	function richTextClick (imgs) {
		if (imgs.length) {
			wx.previewImage({
				current: imgs[0], // 当前显示图片的http链接
				urls: imgs
			})
		}
	}
</script>

<style lang="less">
	@import url(shared.less);
	@title-size: 32rpx;
	@mini-size: 22rpx;
	@content-size: 25rpx;
	@floor-size: 19rpx;
	@font-color: #A1A6AE;

	#relocation {
		.title-area {
			width: calc(32rpx * 22);
		}

		.main-content {
			padding-bottom: 30rpx;
		}
	}
</style>